{template "header-huiyuan.html"}
{template "fanhui-index.html"}
<div class="d-kuan" >
<div class="d-kuan" id="dizhi">
	<div class="d-container" >
		<div class="d-row">
			<div class="col-md-6 col-md-offset-3  d-yuanjiao-20">
				<div class="row">
					<div class="d-yuanjiao-10 d-kuan d-bianhua-20 ">
						<div class="portlet light ">
							<div class="portlet-title">
								<div class="caption">
									<span class="caption-subject"> 邮寄地址</span>
								</div>
								<div class="caption pull-right" data-toggle="modal" data-target="#mydizhiadd" >
									<a><span class="caption-subject"><i class="fa fa-plus-circle d-zitiyanse-hui"></i> 添加地址</span></a>
									
								</div>
								
							</div>
							<div class="portlet-body" >
								<div v-if="list.length > 0">
									<div v-for="tiem in list" :key="tiem.id" class="table-scrollable table-scrollable-borderless">
										
										<div class="d-shang-10 d-kuan ">
											<div class="pull-left">姓名: {{ tiem.xingming }}</div>
											<div class="pull-right" v-if="tiem.moren == 1" style="color:#ff0000">已默认 </div>
											<div v-else class="pull-right" style="color:#b1b1b1" @click="morenshezhi(tiem.id)"><a style="color:#b1b1b1"> 设为默认 </a></div>
											<div class="d-clear"></div>
										</div>
										<div class="d-shang-10 d-kuan ">
											<div class="pull-left">联系: {{ tiem.shoujihaoma }}</div>
											<div class="pull-right" style="color:#a3a3a3" @click="xiugaidata(tiem.id)"> <a style="color:#b1b1b1" data-toggle="modal" data-target="#mydizhixiugai">修改</a> </div>
											
											<div class="d-clear"></div>
										</div>
										<div class="d-shang-10 d-kuan ">
											地址: {{ tiem.dizhi }}
										</div>
										<div class="d-xian d-shangxia-10"></div>
									</div>
								</div>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>
	<div id="mydizhiadd" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="mydizhiadd">
	  <div class="modal-dialog modal-sm" role="document">
		<div class="modal-content">
			<div class="d-neikuang-10">
				<form @submit.prevent="addProduct">
				  <div class="form-group">
					<label for="exampleInputEmail1">姓名</label>
					<input type="text" class="form-control" v-model="newProduct.xingming" placeholder="姓名">
				  </div>
				  <div class="form-group">
					<label for="exampleInputEmail1">联系电话</label>
					<input type="text" class="form-control" v-model="newProduct.shoujihaoma"  placeholder="联系电话">
				  </div>
				  <div class="form-group">
					<label for="exampleInputEmail1">地址</label>
					<textarea class="form-control" style="height:70px; width:100%;" v-model="newProduct.dizhi" placeholder="地址"></textarea>
				  </div>
				  <button type="submit"  class="btn btn-default">添加</button>
				</form>
			</div>
		  
		</div>
	  </div>
	</div>
	<div id="mydizhixiugai" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="mydizhixiugai">
	  <div class="modal-dialog modal-sm" role="document">
		<div class="modal-content">
			<div class="d-neikuang-10">
				<form @submit.prevent="postxiugaidata(xiugaiid)">
				  <div class="form-group">
					<label for="exampleInputEmail1">姓名</label>
					<input type="text" class="form-control" v-model="xiugai.xingming" placeholder="姓名">
				  </div>
				  <div class="form-group">
					<label for="exampleInputEmail1">联系电话</label>
					<input type="text" class="form-control" v-model="xiugai.shoujihaoma"  placeholder="联系电话">
				  </div>
				  <div class="form-group">
					<label for="exampleInputEmail1">地址</label>
					<textarea class="form-control" style="height:70px; width:100%;" v-model="xiugai.dizhi" placeholder="地址"></textarea>
				  </div>
				  <button type="submit"  class="btn btn-default">修改</button>
				</form>
			</div>
		  
		</div>
	  </div>
	</div>
</div>
</div>
<script >
	const { createApp } = Vue;
	const app = createApp({  
	        data() {  
	            return {  
	                list: []  ,// 初始化为空数组，稍后将用接口数据填充
					addResult: {} ,// 用于存储添加结果或错误信息的字符串
					newProduct: {},
					xiugai:{},
					xiugaiid:''
	            };  
	        },  
	        methods: {  
	            fetchProducts() {
	                axios.get('/index.php?s=member&app=quan&c=dizhi&m=list&uid={$member.id}') // 发送GET请求到指定的URL  
	                    .then(response => {
							
							if(response.data.code==0){
								layer.msg(response.data.msg,{time:500});
							}
							if(response.data.code==1){
								this.list = response.data.data;
							}
	                        // 假设服务器返回的数据在response.data中  
	                    })  
	                    .catch(error => {  
	                        console.error('Error fetching products:', error); // 处理错误情况  
	                    });  
	            },
				addProduct() {  
				      // 使用axios发送POST请求  
					  var data = '&xingming='+this.newProduct['xingming']+'&shoujihaoma='+this.newProduct['shoujihaoma']+'&dizhi='+this.newProduct['dizhi'];
					  
				      axios.post('/index.php?is_ajax=1&s=member&app=quan&c=dizhi&m=add', data)  
				        .then(response => {  
				          // 请求成功，处理响应数据  
						  if(response.data.code==0){
						  	layer.msg(response.data.msg,{time:500});
						  }
						  if(response.data.code==1){
						  	layer.msg(response.data.msg,{time:500});
							this.newProduct = {'xingming':'',};
							this.fetchProducts();
							$("#mydizhiadd").hide();
							$(".modal-backdrop").hide();
						  }
				          this.addResult = 'Product added successfully!'; // 或者使用response.data中的实际信息  
				          // 你可以根据需要清空表单字段或执行其他操作  
				          //this.newProduct = {}; // 清空表单  
						  
				        })  
				        .catch(error => {  
				          // 请求失败，处理错误  
				          this.addResult = 'Error adding product: ' + error.message;  
				          console.error('Error adding product:', error); // 在控制台打印错误信息  
				        });  
					
				},
				xiugaidata(id) {
				    axios.get('/index.php?s=member&app=quan&c=dizhi&m=xiugai&id='+id) // 发送GET请求到指定的URL  
				        .then(response => {
							
							if(response.data.code==0){
								layer.msg(response.data.msg,{time:500});
							}
							if(response.data.code==1){
								this.xiugai = response.data.data;
								this.xiugaiid = id;
								
							}
				            // 假设服务器返回的数据在response.data中  
				        })  
				        .catch(error => {  
				            console.error('Error fetching products:', error); // 处理错误情况  
				        });  
				},
				postxiugaidata(id) {
					// 使用axios发送POST请求
					var data = '&xingming='+this.xiugai['xingming']+'&shoujihaoma='+this.xiugai['shoujihaoma']+'&dizhi='+this.xiugai['dizhi'];
				    axios.post('/index.php?s=member&app=quan&c=dizhi&m=xiugai&id='+id,data) // 发送GET请求到指定的URL  
				        .then(response => {
							
							if(response.data.code==0){
								layer.msg(response.data.msg,{time:500});
							}
							if(response.data.code==1){
								this.fetchProducts();
								$("#mydizhixiugai").hide();
								$(".modal-backdrop").hide();
								this.newProduct = {'xingming':'',};
							}
				            // 假设服务器返回的数据在response.data中  
				        })  
				        .catch(error => {  
				            console.error('Error fetching products:', error); // 处理错误情况  
				        });  
				},
				morenshezhi(id) {
					console.log(id);
				    axios.get('/index.php?s=member&app=quan&c=dizhi&m=moren&id='+id) // 发送GET请求到指定的URL  
				        .then(response => {
							
							if(response.data.code==0){
								layer.msg(response.data.msg,{time:500});
							}
							if(response.data.code==1){
								layer.msg(response.data.msg,{time:500});
								this.fetchProducts();
							}
				            // 假设服务器返回的数据在response.data中  
				        })  
				        .catch(error => {  
				            console.error('Error fetching products:', error); // 处理错误情况  
				        });  
				},
				 
	        },
			mounted() {  
				// 在组件挂载后调用fetchProducts方法  
				this.fetchProducts();  
			}
	    });  
	    // 挂载应用到DOM元素上  
	app.mount('#dizhi');  
	
	// 购买地址
	    function add_buy() {
	        var url = "{dr_url('quan/shangpin/buy', ['id' => $id]}";
	        $.get("/index.php?is_ajax=1&s=member&app=quan&c=shangpin&m=jiance&id={$member.id}", function(data){
	        	//dr_cmf_tips(data.code, data.msg);
	            if (data.code =="1") {
	        		
					window.location.href = url;
					
	                //console.log('jin', msg); 
	            }
				if (data.code =="0") {
					
					layer.msg(data.msg,{time:500});
				   
				}
				
	        }, 'json');
	    }
</script>
{template "fanhui.html"}
{template "mfooter.html"}